<template>
  <el-table :data="tableData" fit v-bind="$attrs">
    <column
      v-for="item in options"
      :col="item"
      :key="item.prop"
      :default="columnDefault"
    >
      <template v-for="slot in Object.keys($slots)" #[slot]="scope">
        <slot :name="slot" v-bind="scope" />
      </template>
    </column>
    <!--  判断是否传了actions的slot  -->
    <el-table-column
      label="操作"
      v-if="$slots.actions"
      fixed="right"
      v-bind="actions || {}"
    >
      <template v-slot:default="scope">
        <slot name="actions" v-bind="scope" />
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import column from "./column.vue";
export default {
  name: "tableComponent",
  components: { column },
  props: {
    /*
     * el-table-column兼容
     * */
    actions: {
      type: Object,
      default: null,
    },
    tableData: {
      type: Array,
      default: () => [],
    },
    options: {
      type: Array,
      default: () => [],
    },
    columnDefault: {
      type: Object,
      default: () => {},
    },
  },
  mounted() {},
  data() {
    return {};
  },
};
</script>

<style scoped lang="scss"></style>
